<html id="html" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
<title>无标题文档</title>
<style type="text/css">
*
{
	margin:0px;
	padding:0px;
	border:0px;
	list-style:none;
}
html{
	font-size: 1.5rem;
}
body
{
	font-family:"微软雅黑";
	color:#666666;
	background:#f4f4f4;
	height: 4rem;
	line-height: 4rem;
}
a
{
	text-decoration:none;
	padding-left:5%;
	color:#000;

}

.kuang
{
	padding-top:0.6rem;
	background:#FFF;
	font-size:1.5rem;
}
.kuang li
{
	background-repeat:no-repeat;
	background-position:95%;
	border-bottom:1px #f0f0f0 solid;
}
.kuang img
{
	width:5%;
}
.kuang .icon{
	display: inline-block;
	vertical-align: middle;
	width: 1.8rem;
	padding-right: 1.5rem;
	
}

.clear:after{content: ".";display: block;width: 0;height: 0;visibility: hidden;clear: both;}
</style>
</head>

<body>
<div class="outbox">
	<div class="kuang">
    	<ul>
        	<li><a href=""><img class="icon" src="img/fast.png" />快充站</a></li>
            <li><a href=""><img class="icon" src="img/slow.png" />慢充站</a></li>
            <li><a href=""><img class="icon" src="img/mix.png" />快充慢充混合站</a></li>
            <li><a href=""><img class="icon" src="img/all.png" />第三方站点</a></li>
            <li><a href=""><img class="icon" src="img/thir.png" />站点聚合</a></li>
        </ul>
    </div>
    
</div>
<script>
	(function(){

		var html = document.getElementById('html'),

				width = window.innerWidth;

		html.style.fontSize = ( ( width * 10 ) / 320 ) + 'px';

	})();
</script>
</body>
</html>
